<% burnt_fees = if !is_nil(@block.base_fee_per_gas), do: Wei.mult(@block.base_fee_per_gas, BlockBurntFeeCounter.fetch(@block.hash)), else: nil %>
<% priority_fee = if !is_nil(@block.base_fee_per_gas), do: BlockPriorityFeeCounter.fetch(@block.hash), else: nil %>
<div class="tile tile-type-<%= String.downcase(@block_type) %> fade-up" data-selector="block-tile" data-block-number="<%= to_string(@block.number) %>" data-block-hash="<%= @block.hash %>">
  <div class="row">
    <div class="tile-transaction-type-block col-md-2 d-flex flex-row flex-md-column">
      <%= if @block_type == "Block" do %>
        <%= link(
              class: "tile-label",
              to: block_path(BlockScoutWeb.Endpoint, :show, @block),
              "data-selector": "block-number"
            ) do %>
            #<%= @block %>
          <% end %>
      <% else %>
        <%= link(
              class: "tile-label",
              to: block_path(BlockScoutWeb.Endpoint, :show, @block.hash),
              "data-selector": "block-number"
            ) do %>
            #<%= @block %>
          <% end %>
      <% end %>
      <span class="tile-status-label font-weight-400" data-test="transaction_type"><%= @block_type %></span>
    </div>
    <div class="col-md-6 col-lg-7">
      <div>
        <!-- transactions -->
        <span class="mr-2">
          <%= ngettext("%{count} transaction", "%{count} transactions", Enum.count(@block.transactions)) %>
        </span>
        <%= if @block.size do %>
           <!-- size -->
          <span class="mr-2"> <%= Cldr.Unit.new!(:byte, @block.size) |> cldr_unit_to_string!() %> </span>
        <% end %>
        <!-- age -->
        <span data-test="data-from-now" data-from-now="<%= @block.timestamp %>"></span>
      </div>
      <%= if !Application.get_env(:block_scout_web, :hide_block_miner) do %>
        <div class="text-nowrap text-truncate mt-3 mt-md-0">
          <!-- validator -->
          <%= gettext "Miner" %>
          <%= render BlockScoutWeb.AddressView,
            "_link.html",
            address: @block.miner,
            contract: false,
            use_custom_tooltip: false %>
        </div>
      <% end %>
      <%= if show_reward?(@block.rewards) do %>
        <div class="text-nowrap text-truncate mt-3 mt-md-0">
          <!-- validator reward -->
          <%= gettext "Reward" %>
          <span class="ml-2">
            <%= combined_rewards_value(@block) %>
          </span>
        </div>
      <% end %>
    </div>
    <div class="col-md-4 col-lg-3 text-md-right d-flex flex-column align-items-md-end justify-content-md-end mt-3 mt-md-0">
      <%= if !is_nil(@block.base_fee_per_gas) do %>
        <!-- Priority Fee -->
        <span> <%= format_wei_value(%Wei{value: priority_fee}, :ether) %> <%= gettext "Priority Fees" %> </span>
        <!-- Burnt Fees -->
        <span> <%= format_wei_value(burnt_fees, :ether) %> <%= gettext "Burnt Fees" %> </span>
      <% end %>
      <!-- Gas Limit -->
      <span> <%= formatted_gas(@block.gas_limit) %> <%= gettext "Gas Limit" %> </span>
      <!-- Gas Used -->
      <div class="mr-3 mr-md-0">
        <%= formatted_gas(@block.gas_used) %>
        <% gas = if Decimal.compare(@block.gas_limit, 0) == :gt, do: Decimal.to_integer(@block.gas_used) / Decimal.to_integer(@block.gas_limit), else: 0  %>
        (<%= formatted_gas(gas, format: "#.#%") %>)
        <%= gettext "Gas Used" %>
      </div>
      <!-- Progress bar -->
      <div class="progress">
        <div class="progress-bar" role="progressbar" style="width: <%= formatted_gas(gas, format: "#.#%") %>;" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100">
        </div>
      </div>
    </div>
  </div>
</div>
